<template>
  
  <div>
      添加商品页面
{{ ok }}
      <el-cascader :props="props" v-model="ok"></el-cascader>


      <editor-vue 
      :content="content"
      :readOnlys="readOnlys"
      @changeData="hChangeData"
      @uploadImg="hUploadImg"
      />
  </div>
</template>

<script>
import editorVue from "../../components/Editor.vue"
 export default {
    components: {
      editorVue,
    },
    data() {
      return {
        readOnlys: false,
        content: ``,//给后端传 编辑器的内容
        ok:"",
        categoryLevel:1,
        parentId:0,
        props:{
          lazy: true,
          lazyLoad:(node,resolve)=>{
              console.log(node);
              if(node.level==0){
                // console.log(this);
                  // ajax请求*4
                  this.getPage(1,resolve,node);
              }else if(node.level==1){
                  this.categoryLevel=2;
                  this.parentId=node.value
                  this.getPage(1,resolve,node);
              }else if(node.level==2){
                  this.categoryLevel=3;
                  this.parentId=node.value
                  this.getPage(1,resolve,node);
              }

              // if(node.level==0){//刚进入页面发送 一级分类
              //       let arry=[
              //          {
              //            id:1,
              //            value:100,
              //            label:"前端开发"
              //          },
              //          {
              //            id:2,
              //            value:200,
              //            label:"后端开发"
              //          }
              //       ]

              //       resolve(arry)
              // }else if(node.level==1){//通过一级id 获取二级分类

              //   let arry=[//ajax
              //          {
              //            id:21,
              //            value:21,
              //            label:"前端开发222222"
              //          },
              //          {
              //            id:22,
              //            value:22,
              //            label:"后端开发2222"
              //          }
              //       ]

              //       resolve(arry)
                  
              // }else if(node.level==2){
              //   let arry=[//ajax
              //          {
              //            id:31,
              //            value:31,
              //            label:"3333001",
              //            leaf:node.level>=2
              //          },
              //          {
              //            id:32,
              //            value:32,
              //            label:"333002",
              //            leaf:node.level>=2
              //          }
              //       ]

              //       resolve(arry)
              // }

              
          }
        }
      };
    },
    mounted(){
        if(this.$route.query.goodsid){//ajax请求
            //  console.log("修改");
        }else{
            // console.log("添加");
        }

    },
    methods: {
      hChangeData(editDataHtml){
        // 获取最新的html数据
        this.content = editDataHtml
        // console.log(this.content)
      },
      hUploadImg(file,insertFn){//ajax请求
        console.log(file)
        // 插入图片，调接口返回图片url,通过插入conteng
        let imgUrl = 'http://124.223.220.96:28019/upload/20230417_11111210.png'
        
        insertFn(imgUrl);//接口请求成功之后*****调用这个函数
  
        // 设置只读
        // this.readOnlys = true;
      },

     async getPage(page,resolve,node){
         let result=await this.$http.get("/categories",{
             params:{
                 
               pageNumber:page,
               pageSize:1000,
               categoryLevel:this.categoryLevel,
               parentId:this.parentId
             }
         })
          
         var arry=[];
        result.data.list.map(item=>{
             arry.push({
                 value:item.categoryId,
                 label:item.categoryName,
                 leaf:node.level>=2
             })
        })

        resolve(arry)
      
         console.log(arry);
         
     }
    },
  };
</script>

<style>

</style>